---
title: 'Hosted'
description: 'Use consent.io for an easy, managed consent storage solution with minimal setup'
lastModified: 2025-08-22
availableIn:
  - framework: 'next'
    url: '/docs/frameworks/next/storing-consent/hosted'
    title: 'Next.js'
  - framework: 'react'
    url: '/docs/frameworks/react/storing-consent/hosted'
    title: 'React'
  - framework: 'javascript'
    url: '/docs/frameworks/javascript/storing-consent/hosted'
    title: 'JavaScript'
---

<import>../../javascript/shared/storing-consent/hosted.mdx#overview</import>

## Implementation

```tsx title="src/App.tsx"
import { 
  ConsentManagerDialog,
  ConsentManagerProvider,
  CookieBanner,
} from '@c15t/react';

function App() {
  return (
    <ConsentManagerProvider options={{  
      mode: 'c15t', 
      backendURL: "https://your-instance.c15t.dev",
      consentCategories: ['necessary', 'marketing'], // Optional: Specify which consent categories to show in the banner. 
      ignoreGeoLocation: true, // Useful for development to always view the banner.
    }}>
      <div className="App">
        {/* Your application content */}
      </div>
      <CookieBanner />
      <ConsentManagerDialog />
    </ConsentManagerProvider>
  );
}

export default App;
```

<import>../../javascript/shared/storing-consent/hosted.mdx#using-consent-io</import>
